import React from 'react'
import {Row, Col, Card, List} from 'antd'
import {LeftOutlined} from '@ant-design/icons';
import '../styles.css'
import axios from "axios";
import api from "../../../api/api";


class ReleaseDetail extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            title: "新增公司",
            visitingInfo: {
                //审核部门
                companyName: "",//访问公司
                factoryName: "",//访问厂区
                visitingDepartment: "",//访问部门
                auditor: "",//审核人员
                //申请信息
                company: "",//公司名称
                applicationDepartment: "",//部门名称
                name: "",//访客姓名
                phoneNum: "",//手机号码
                carNum: "",//车辆信息
                reason: "",//到访事由
                goods: "",//携带物品
                front: "",//证件照片正面
                back: "",//证件照片反面
                //审核信息
                auditStatus: "",//审核状态
                checkType:"",
                checkStep:1,
                checkLeaderType:"",
                guikouCheckLeaderType:"",
                dismissReason: "",//驳回原因
                //归口信息
                meterialType:"",
                guiUserName:"",
                guikouCheckType:"",//归口审核状态
                guikouReason:"",//归口驳回原因
                //到访信息
                visitState: "",//到访状态
                applicationTime: "",//申请时间
                reviewTime: "",//审核时间
                visitingTime: "",//到访时间
                leaveTime: ""//出厂时间
            },
            appendixInfoList:[]
        };
    }

    componentDidMount() {
        console.log("初始化");
        this.props.onRef('releaseDetail', this)
    }

    getReleaseSlipInfo(selectDetailReleaseId) {
        let that = this;
        console.info("获取访客信息releaseId=" + selectDetailReleaseId);
        let url = api.api_URL + "/admin/releaserecord/queryReleaseApplyRecordById?releaseId=" + selectDetailReleaseId + "&orgCode=" + localStorage.getItem('orgCode');
        axios.get(url, {
            headers: {
                "Authorization": localStorage.getItem('token'),
                "Content-Type": api.ContentType
            }
        }).then(function (res) {
            if (res.data.code != 1) {
                alert(res.data.msg);
                return;
            }
            let applyRecord = res.data.data.applyRecord;
            console.log(applyRecord)
            that.setState({
                visitingInfo: {
                    companyName: applyRecord.companyName,
                    factoryName: applyRecord.factoryName,
                    visitingDepartment: applyRecord.deptName,
                    workNumber:applyRecord.workNumber,
                    auditor: applyRecord.userName,
                    company: applyRecord.gname,
                    applicationDepartment: applyRecord.department,
                    name: applyRecord.visitName,
                    phoneNum: applyRecord.mobile,
                    usagement:applyRecord.usagement,
                    planOutTime:applyRecord.planOutTime,
                    belongingsName:applyRecord.belongingsName,
                    belongingsMobile:applyRecord.belongingsMobile,
                    destination:applyRecord.destination,
                    contractNumber:applyRecord.contractNumber,
                    carNumber:applyRecord.carNumber,
                    carNum: applyRecord.carNumber,
                    remark:applyRecord.remark,
                    projectNumber:applyRecord.projectNumber,
                    goods: applyRecord.meterialName,
                    meterialAmount:applyRecord.meterialAmount,
                    front: api.api_URL + `/admin/fileupload/getIDCardStream?urlPath=` + applyRecord.idCardOne,
                    back: api.api_URL + `/admin/fileupload/getIDCardStream?urlPath=` + applyRecord.idCardTwo,
                    auditStatus: applyRecord.status == 1 ? "审核中" : applyRecord.status == 2 ? "已通过" : "已驳回",//最终审核状态
                    checkType: !applyRecord.checkType || applyRecord.checkType == 1 ? "审核中" : applyRecord.checkType == 2 ? "已通过" : "已驳回",//审核状态
                    checkStep: applyRecord.checkStep,
                    checkLeaderType: !applyRecord.checkLeaderType || applyRecord.checkLeaderType == 1 ? "审核中" : applyRecord.checkLeaderType == 2 ? "已通过" : "已驳回",//审核状态
                    guikouCheckLeaderType: !applyRecord.guikouCheckLeaderType || applyRecord.guikouCheckLeaderType == 1 ? "审核中" : applyRecord.guikouCheckLeaderType == 2 ? "已通过" : "已驳回",//审核状态
                    dismissReason: applyRecord.reason,//驳回原因
                    meterialType:applyRecord.meterialType+"-"+applyRecord.meterialTypeName,
                    guiUserName:applyRecord.guiUserName,
                    guikouCheckType: !applyRecord.guikouCheckType || applyRecord.guikouCheckType == 1 ? "审核中" : applyRecord.guikouCheckType == 2 ? "已通过" : "已驳回",//归口审核状态
                    guikouReason: applyRecord.guikouReason,//归口驳回原因
                    visitState: applyRecord.handleType == 0 || applyRecord.handleType === undefined ? "未出厂" : applyRecord.handleType == 2 ? "已出厂" : "未出厂",//到访状态
                    applicationTime: applyRecord.createTime,//"2020-03-20 04:00:00",//申请时间
                    reviewTime: applyRecord.createTime,//审核时间
                    visitingTime: applyRecord.planOutTime,//"2020-03-20 07:00:00",//到访时间
                    leaveTime: applyRecord.outTime//"2020-03-20 20:00:00"//出厂时间
                },
                appendixInfoList: res.data.data.appendixInfoList
            })
        }).catch(function (err) {
            console.log(err);
        })


    }

    returnMain = e => {
        console.log("detail returnMain")
        this.props.returnMain()
    }

    render() {
        return (
            <div className="girdBg">
                <Row className="searchBox">
                    <Col>
                        <div className="returnBtn" onClick={this.returnMain}>
                            <LeftOutlined/>返回
                        </div>
                    </Col>
                </Row>
                <Row className="searchBox">
                    <Col span={24}>
                        <Card title="审核部门" bordered={false}>
                            {/*<p>*/}
                                {/*<span>访问公司:</span>*/}
                                {/*<span>{this.state.visitingInfo.companyName}</span>*/}
                            {/*</p>*/}
                            <p>
                                <span>访问公司:</span>
                                <span>{this.state.visitingInfo.factoryName}</span>
                            </p>
                            <p>
                                <span>访问部门:</span>
                                <span>{this.state.visitingInfo.visitingDepartment}</span>
                            </p>
                            <p>
                                <span>审核人员:</span>
                                <span>{this.state.visitingInfo.auditor}</span>
                            </p>
                        </Card>
                        <Card title="申请信息" bordered={false}>
                            <p>
                                <span>申请人:</span>
                                <span>{this.state.visitingInfo.name}</span>
                            </p>
                            <p>
                                <span>申请工号:</span>
                                <span>{this.state.visitingInfo.workNumber}</span>
                            </p>
                            <p>
                                <span>公司名称:</span>
                                <span>{this.state.visitingInfo.company}</span>
                            </p>
                            <p>
                                <span>部门名称:</span>
                                <span>{this.state.visitingInfo.applicationDepartment}</span>
                            </p>
                            <p>
                                <span>手机号码:</span>
                                <span>{this.state.visitingInfo.phoneNum}</span>
                            </p>

                        </Card>
                        <Card title="出厂物资明细" bordered={false}>
                            <p>
                                <span>物资携带人:</span>
                                <span>{this.state.visitingInfo.belongingsName}</span>
                            </p>
                            <p>
                                <span>物资携带人手机号:</span>
                                <span>{this.state.visitingInfo.belongingsMobile}</span>
                            </p>
                            <p>
                                <span>物资名称/规格:</span>
                                <span>{this.state.visitingInfo.goods}</span>
                            </p>

                            <p>
                                <span>计划出厂时间:</span>
                                <span>{this.state.visitingInfo.planOutTime}</span>
                            </p>
                            <p>
                                <span>物资去向:</span>
                                <span>{this.state.visitingInfo.destination}</span>
                            </p>
                            <p>
                                <span>物资用途:</span>
                                <span>{this.state.visitingInfo.usagement}</span>
                            </p>
                            <p>
                                <span>出厂车牌号:</span>
                                <span>{this.state.visitingInfo.carNumber}</span>
                            </p>
                            <p>
                                <span>合同号:</span>
                                <span>{this.state.visitingInfo.contractNumber}</span>
                            </p>
                            <p>
                                <span>工程名称/号:</span>
                                <span>{this.state.visitingInfo.projectNumber}</span>
                            </p>
                            <p>
                                <span>物资类型:</span>
                                <span>{this.state.visitingInfo.meterialType}</span>
                            </p>
                            <p>
                                <span>物资数量/重量（T/个）:</span>
                                <span>{this.state.visitingInfo.meterialAmount}</span>
                            </p>
                            <p>
                                <span>备注:</span>
                                <span>{this.state.visitingInfo.remark}</span>
                            </p>
                            <p>
                                <span>携带人身份证件:</span>
                            </p>
                            <div>
                                <img className="cardImg"
                                     style={{marginRight: 30}}
                                     alt="logo"
                                    // src={"https://gw.alipayobjects.com/zos/rmsportal/mqaQswcyDLcXyDKnZfES.png"}
                                     src={this.state.visitingInfo.front}
                                />
                                <img className="cardImg"
                                     alt="logo"
                                    // src="https://gw.alipayobjects.com/zos/rmsportal/mqaQswcyDLcXyDKnZfES.png"
                                     src={this.state.visitingInfo.back}
                                />
                            </div>
                        </Card>
                        <Card className={this.state.appendixInfoList.length === 0 ? "elementHidden" : "elementShow"}
                              title="上传附件" bordered={false}>
                            {this.state.appendixInfoList.map((item) => {
                                return (
                                    <div>
                                        <div>
                                            <img className="cardImg"
                                                 style={{marginRight: 30}}
                                                 alt="logo"
                                                 src={api.api_URL + `/admin/fileupload/getIDCardStream?urlPath=` + item.appendix}
                                            />
                                        </div>
                                    </div>
                                );
                            })}
                        </Card>
                        <Card title="审核信息" bordered={false}>
                            <p>
                                <span>最终审核状态:</span>
                                <span>{this.state.visitingInfo.auditStatus}</span>
                            </p>
                            <p className={this.state.visitingInfo.checkType === '已驳回' ? "elementShow" : "elementHidden"}>
                                <span>驳回原因:</span>
                                <span>{this.state.visitingInfo.dismissReason}</span>
                            </p>
                            <p>
                                <span>本部门室主任审核状态:</span>
                                <span>{this.state.visitingInfo.checkType}</span>
                            </p>
                            <p className={this.state.visitingInfo.checkStep > 1  ? "elementShow" : "elementHidden"}>
                                <span>本部门部门长审核状态:</span>
                                <span>{this.state.visitingInfo.checkLeaderType}</span>
                            </p>
                            <p className={this.state.visitingInfo.meterialType.startsWith("B") && this.state.visitingInfo.checkStep > 2  ? "elementShow" : "elementHidden"}>
                                <span>物资部/保障部室主任审核状态:</span>
                                <span>{this.state.visitingInfo.guikouCheckType}</span>
                            </p>
                            <p className={this.state.visitingInfo.meterialType.startsWith("B") && this.state.visitingInfo.checkStep > 3  ? "elementShow" : "elementHidden"}>
                                <span>物资部/保障部部门长审核状态:</span>
                                <span>{this.state.visitingInfo.guikouCheckLeaderType}</span>
                            </p>
                        </Card>

                        <Card className={this.state.visitingInfo.meterialType === 'B' && this.state.visitingInfo.checkType === '已通过' ? "elementShow" : "elementHidden"} title="归口审核信息" bordered={false}>
                            <p>
                                <span>归口审核人员:</span>
                                <span>{this.state.visitingInfo.guiUserName}</span>
                            </p>
                            <p>
                                <span>归口审核状态:</span>
                                <span>{this.state.visitingInfo.guikouCheckType}</span>
                            </p>
                            <p className={this.state.visitingInfo.guikouCheckType === '已驳回' ? "elementShow" : "elementHidden"}>
                                <span>归口驳回原因:</span>
                                <span>{this.state.visitingInfo.guikouReason}</span>
                            </p>
                        </Card>
                        <Card title="门岗信息" bordered={false}>
                            <p>
                                <span>门岗状态:</span>
                                <span>{this.state.visitingInfo.visitState}</span>
                            </p>
                            <p>
                                <span>申请时间:</span>
                                <span>{this.state.visitingInfo.applicationTime}</span>
                            </p>
                            {/*<p className={this.state.visitingInfo.auditStatus === '审核中' ? "elementHidden" : "elementShow"}>*/}
                                {/*<span>审核时间:</span>*/}
                                {/*<span>{this.state.visitingInfo.reviewTime}</span>*/}
                            {/*</p>*/}
                            <p>
                                <span>计划出厂时间:</span>
                                <span>{this.state.visitingInfo.visitingTime}</span>
                            </p>
                            <p className={this.state.visitingInfo.visitState === '已出厂' ? "elementShow" : "elementHidden"}>
                                <span>实际出厂时间:</span>
                                <span>{this.state.visitingInfo.leaveTime}</span>
                            </p>
                        </Card>
                    </Col>
                </Row>
            </div>
        )
    }
}

export default ReleaseDetail